import { Fragment } from 'react';
import {
  ConfirmationButtons,
  Message,
  YesButton,
  NoButton,
} from './styledComponents/styled';
export const ConfirmationModal = (props) => {
  const {
    message,
    onConfirm,
    onCancel,
    sureColor,
    sureHoverColor,
    cancelColor,
    cancelHoverColor,
    cancelText,
    sureText,
  } = props;
  return (
    <Fragment>
      <Message>{message}</Message>
      <ConfirmationButtons>
        <YesButton
          onClick={onConfirm}
          sureColor={sureColor}
          sureHoverColor={sureHoverColor}
        >
          {sureText}
        </YesButton>
        <NoButton
          onClick={onCancel}
          cancelColor={cancelColor}
          cancelHoverColor={cancelHoverColor}
        >
          {cancelText}
        </NoButton>
      </ConfirmationButtons>
    </Fragment>
  );
};
